<template>
  <mescroll-uni
    ref="mescrollRef"
    @init="mescrollInit"
    :height="height"
    :disable-scroll="disableScroll"
    :down="downOption"
    :up="upOption"
    @up="upCallback"
    @emptyclick="emptyClick"
  >
    <ProList :dataList="goods"></ProList>
  </mescroll-uni>
</template>

<script>
import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
import MescrollMoreItemMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mixins/mescroll-more-item.js";
import ProList from './ProList'
export default {
  mixins: [MescrollMixin, MescrollMoreItemMixin],
  components: {
    ProList
  },
  data () {
    return {
      downOption: {
        use: false
      },
      upOption: {
        auto: false,
        noMoreSize: 4,
        empty: {
          tip: '~ 空空如也 ~',
          btnText: '去看看'
        }
      },
      goods: []
    }
  },
  props: {
    type: {
      type: String,
      default: ''
    },
    sort: {
      type: String,
      default: ''
    },
    i: Number,
    index: {
      type: Number,
      default () {
        return 0
      }
    },
    height: [Number, String],
    disableScroll: Boolean
  },
  watch: {
    sort () {
      if (this.index === this.i) {
        this.mescroll.resetUpScroll()
      }
    }
  },
  methods: {
    upCallback (page) {
      this.$axios.api.getProduct({
        isTop: 1,
        type: this.type,
        sort: this.sort,
        page: page.num - 1,
        limit: page.size
      }).then(res => {
        this.mescroll.endSuccess(res.data.length)
        if (page.num == 1) this.goods = []
        this.goods = this.goods.concat(res.data)
      }).catch(() => {
        this.mescroll.endErr()
      })
    },
    emptyClick () {
      uni.showToast({
        title: '点击了按钮,具体逻辑自行实现'
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.content {
  height: 100%;
}
</style>
